<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="description" content="Description">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0">
    <title>颜色收藏</title>
    <style>
.main{
    margin: 20px auto;
    width: 60%;
    color: #fff;
}
.box{
    height: 50px;
    padding: 10px;
}
    </style>
</head>
<body>
    <div class="main">
        <div class="box" style="background-color: #f83f2d;">#f83f2d</div>
        <div class="box" style="background-color: #f8b327;">#f8b327</div>
        <div class="box" style="background-color: #26b34d;">#26b34d</div>
        <div class="box" style="background-color: #1f61fd;">#1f61fd</div>
        <div class="box" style="background-color: #bd43fc;">#bd43fc</div>
        <div class="box" style="background-color: #fd6f35;">#fd6f35</div>
        <div class="box" style="background-color: #ff2442;">#ff2442</div>
        <div class="box" style="background-color: #fe9d18;">#fe9d18</div>
        <div class="box" style="background-color: #92d050;">#92d050</div>
        <div class="box" style="background-color: #ff7d78;">#ff7d78</div>
        <div class="box" style="background-color: #0085ff;">#0085ff</div>
    </div>
</body>
</html>